<template>
    <div class="second-source">
        <div class="source-header">
            <p class="source-header-title animated shake">实用软件</p>
        </div>
        <div class="source-content">
            <div class="row">
                <div class="col-sm-6 col-md-4" v-for="(item,index) in softwareList"  :key="item.id">
                    <div class="thumbnail">
                        <img :src="item.img_url" alt="...">
                        <div class="caption source-intro">
                            <h4>{{item.name}}</h4>
                            <p class="softwareType">{{item.type}}</p>
                            <a class="btn btn-xs btn-primary" :href="item.link_download" target="_blank">点击获取下载链接</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    import {softwareList} from './list'
    export default {
        name: "index",
        data(){
            return{
                softwareList:[]
            }
        },
        created() {
            this.getSoftwareList()
        },
        methods:{
            getSoftwareList(){
                this.getAxios('/software/all').then(res=>{
                    this.softwareList = res.list
                })
            }
        }
    }
</script>

<style scoped>
    .softwareType{
        width: 100px;
        padding: 5px 20px;
        margin: 10px auto;
        border: 1px solid #ddd;
    }
</style>